<template>
  <div class="index">
    index组件

    <!-- <router-view></router-view> -->
    <RouterView></RouterView>

    <div class="tabbar">
      <!-- <router-link></router-link> -->
      <RouterLink to="/index/home/888">首页</RouterLink>    
      <!-- <RouterLink to="/index/order">订单</RouterLink>     -->
      <!-- <div class="btn" @click="$router.push('/index/order')">订单</div>     -->
      <!-- <div class="btn" @click="$router.push({path:'/index/order',query:{id:888}})">订单</div>     -->
      <div class="btn" @click="$router.push({path:'/index/order',query:{id:888}})">订单</div>    
      <RouterLink to="/index/mine">我的</RouterLink>   
    </div>  
  </div>
</template>

<script setup>

import { useRouter } from 'vue-router'

//实例化路由管理对象
var $router = useRouter(); // new useRouter;

</script>

<style>
.tabbar{
  position: fixed;
  bottom: 0;
  width: 100%;
  padding:10px 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
  box-sizing: border-box;
  border-top: 1px solid #ccc;
}
</style>